<template>
  <footer role="contentinfo" class="FooterMain">
        <div class="s-wrap">
            <div class="row">
                <nav class="NavFooter" role="navigation" aria-label="Footer navigation">
                    <!-- <input class="toggle-target" id="open-nav-footer" type="checkbox" aria-label="Toggle mobile nav menu"> -->
                    <ul>
                        <li class="item"><a href="#">课堂</a></li>
                        <li class="item"><a href="#">学习</a></li>
                        <li class="item"><a href="#">教学</a></li>
                        <li class="item"><a href="#">资讯</a></li>
                        <li class="item"><a href="#">博客</a></li>
                        <li class="item"><a href="#">提示</a></li>
                        <li class="item"><a href="#">投诉</a></li>
                        <li class="item"><a href="#">现在加入</a></li>
                    </ul>
                </nav>
                <div class="under">
                    <!-- <div>菜鸟小王</div> -->
                    <div class="copyright">
                        ©作者：菜鸟小王 @简介：珠海三板村展示 · 
                        <a href="#">服务条款</a> · 
                        <a href="#">隐私政策</a>
                    </div>
                </div>
            </div>
        </div>
    </footer>
</template>

<script>
export default {
    name:"MyFooter"
}
</script>

<style lang="less" scoped>
li {
    list-style: none;
}
a {
    text-decoration: none;
}
.FooterMain{
    float: left;
    background-color: #f2f2f2;
    height: 130px;
    width: 100%;

    .s-wrap{
        max-width: 1200px;
        margin-left: auto;
        margin-right: auto;
        width: 100%;

        .row{
            clear: both;
            margin: 10px 0;
            color: #000;
            overflow: hidden;

            .NavFooter ul li{
                float: left;
                margin: 0 15px;
            }
            .NavFooter ul li a{
                display: block;
                height: 40px;
                color: #aaa;
                line-height: 40px;
                font-size: 14px;
            }
            .NavFooter ul li a:hover{
                text-decoration: underline green;
                color: green;
            }

            .under{
                clear: both;
                margin: 10px 0;
                color: #000;
                overflow: hidden;

                .copyright{
                    float: left;
                    margin: 0 50px;

                    a{
                        color: #8a8a8a;
                        font-size: 14px;
                    }
                    a:hover{
                        text-decoration: underline #8a8a8a;
                    }
                }
            }
        }
        
    }
}
</style>